

<style>
    *{
        padding: 0;
        margin: 0;
    }
    a{
        text-decoration: none;
        display: block;
        width: 100px;
        height: 100px;
        background:#ff88fd; 
        color:white;
        text-align: center;
        height: 100px;
        line-height: 100px;
    }
    a:hover{
        background:#0099ff; 
    }
    a:nth-of-type(2){
        position: relative;
        bottom: 100px;
        left: 200px;
    }
    a:nth-of-type(3){
        position: relative;
        bottom: 100px;
        left: 100px;
    }
    a:nth-of-type(4){
        position: relative;
        bottom: 100px;
        
    }
    a:nth-of-type(5){
        position: relative;
        bottom: 200px;
        left: 200px;
    }
    .box{
        border: 2px solid #ffd0fe;
        width:300px;
        height:300px;
        padding:10px;
        margin:30px auto;
    }
</style>
<div class="box">
    <a href="#">链接1</a>
    <a href="#">链接2</a>
    <a href="#">链接3</a>
    <a href="#">链接4</a>
    <a href="#">链接5</a>
</div>
